<template>
	<view>
		<view class="bgColor-white">
			<view class=" d-flex-yCenter-sb item">
				<text>姓名</text>
				<input type="text" v-model="info.name" placeholder="请输入姓名" />
			</view>
			<view class=" d-flex-yCenter-sb item">
				<text>手机号</text>
				<input type="text" v-model="info.phone" placeholder="请输入手机号码" />
			</view>
			<picker mode="region"  @change="addChange">
				<view class=" d-flex-yCenter-sb item">
					<text>居住地址</text>
					<input type="text" v-model="info.address" :disabled="true" placeholder="请选择居住地址" />
				</view>
			</picker>
			<view class=" d-flex-yCenter-sb item">
				<text>身份证号码</text>
				<input type="idcard" v-model="info.identity_cards"  placeholder="请输入身份证号码" />
			</view>
			<view class=" d-flex-yCenter-sb item" style="border: none;">
				<text class="font-w">身份证正反面</text>
				<!-- <input type="text"  placeholder="请输入姓名" /> -->
			</view>
			<view class="d-flex flex-d aling-centen pb-30">
				<image @tap='xzCodez(0)' :src="codez || '../static/codez.png'" mode=""></image>
				<image @tap='xzCodez(1)' :src=" codef || '../static/codef.png'" class="mt-30" mode=""></image>
			</view>
		</view>
		<view class="pg-30">
			<x-button @btnClick='submit' title="提交申请"></x-button>
		</view>
	</view>
</template>

<script>
	import {
		http_user_add_huke_post
	} from '@/config/apiRouter.js'
	export default {
		data() {
			return {
				codez:'',
				codef:'',
				info:{
					name:'',
					phone:'',
					identity_cards:'',
					address:'',
					cards_z:'',
					cards_f:''
				}
			}
		},
		methods: {
			addChange(e){
				console.log(e);
				this.info.address=e.detail.value.join(' ')
			},
			xzCodez(e){
				uni.chooseImage({
				    count: 1, //默认9
				    sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
				    sourceType: ['album','camera'], //从相册选择
				    success:  (res)=>{
						console.log(res);
						e?this.codef=res.tempFilePaths[0]:this.codez=res.tempFilePaths[0]
				    }
				});
			},
			async submit(){
				if(this.codez==''){
					this.$tool.showToast('请上传身份证正面')
					return
				}
				if(this.codef==''){
					this.$tool.showToast('请上传身份证反面')
					return
				}
				let info=this.info
				let status=false
				for(var key in info){
					if(key=='cards_z' || key=='cards_f')continue
					if(info[key]==''){
						this.$tool.showToast('有关键信息未填写')
						status=true
						return
					}
				}
				if(status)return
				let codez =await this.updateFile({
					url:this.codez
				})
				console.log(codez);
				if(!codez || codez.code!=200){
					this.$tool.showToast('身份证正面上传失败')
					return
				}
				info.cards_z=codez.data.url
				let codef =await this.updateFile({
					url:this.codef
				})
				if(!codef || codef.code!=200){
					this.$tool.showToast('身份证正面上传失败')
					return
				}
				info.cards_f=codef.data.url
				http_user_add_huke_post({
					data:info
				}).then(res=>{
					this.$tool.showToast('申请成功',true)
					setTimeout(()=>{
						this.$tool.navigateBack()
					},800)
				})
			}
		}
	}
</script>

<style lang="scss">
	page{
		height: 100%;
		background: #F5F5F5;
	}
.item{
	padding: 30rpx 0;
	margin: 0 30rpx;
	border-bottom: 1px solid #ddd;
	input{
		width: 450rpx;
	}
}
image{
	width: 540rpx;
	height: 360rpx;
	border-radius: 20rpx;
}
</style>
